import Vue from 'vue'

// 重置css样式
import 'normalize.css/normalize.css' // A modern alternative to CSS resets

// 引入element-ui
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

// 引入element-ui多语言，这里是英文
import locale from 'element-ui/lib/locale/lang/en' // lang i18n

// 引入全局样式
import '@/styles/index.scss' // global css

// 引入跟组件
import App from './App'

// 引入vuex仓库
import store from './store'
// 引入路由
import router from './router'

import '@/icons' // icon
// 引入权限控制模块，token的校验逻辑
import '@/permission' // permission control

/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online ! ! !
 */

// 如果不想使用mock-server，可以使用mockjs模拟api
// if (process.env.NODE_ENV === 'production') {
//   const { mockXHR } = require('../mock')
//   mockXHR()
// }

// 通过自定义指令控制当前按钮的权限
Vue.directive('auth', {
  // 为什么需要动态传入
  inserted(el, args) {
    // args.value按钮的操作标识
    // 个人信息里面points是否可以找到
    // 如果可以找到证明有权限
    // 没找到，删除这个按钮
    const { roles: { points }} = store.state.user.userInfo
    if (!points.includes(args.value)) {
      // 把自己删除掉
      el.remove()
    }
  }
})

// set ElementUI lang to EN
// 注册element-ui 设置element-ui的语言为英文
Vue.use(ElementUI, { locale }) // 设置多语言为英文
// 如果想要中文版 element-ui，按如下方式声明
// Vue.use(ElementUI)

// 设置为 false 以阻止 vue 在启动时生成生产提示。
Vue.config.productionTip = false

// 创建vue实例
new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})

// async function get() {
//   await new Promise((resolve, reject) => {
//     setTimeout(() => {
//       resolve(1000)
//     }, 1000)
//   })
// }
//
// async function foo() {
//   await new Promise((resolve, reject) => {
//     setTimeout(() => {
//       resolve(2000)
//     }, 2000)
//   })
// }
//
// function show() {
//   get()
//   foo()
//   console.log('3000')
// }
//
// show()
